<!--
	作者：offline
	时间：2019-01-31
	描述：公告列表仅查看
-->
<template>
  <div class="m-view-noticeList m-window">
    <div class="m-condition" v-if="!noticeShow">
      <el-row :gutter="10">
        <el-form
          :model="headerRuleForm"
          ref="headerRuleForm"
          label-width="70px"
          :inline-message="true"
          label-position="left"
        >
          <el-col :span="5">
            <el-form-item label="标题" class="rightItem">
              <el-input v-model="title" placeholder="请输入标题" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="发布日期" class="rightItem">
              <el-date-picker
                v-model="applySDate"
                type="date"
                :placeholder="placeholder.start"
                :picker-options="po1"
                value-format="yyyy-MM-dd"
                :editable="false"
                :clearable="false"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-date-picker
              v-model="applyEDate"
              type="date"
              :placeholder="placeholder.end"
              :picker-options="po2"
              value-format="yyyy-MM-dd"
              :editable="false"
              :clearable="false"
            ></el-date-picker>
          </el-col>
        </el-form>
        <el-col :span="2">
          <el-button type="primary" @click="search(1)" :disabled="btnDis">查询</el-button>
        </el-col>
      </el-row>
    </div>
    <div class="m-agTable m-bottom m-top2" v-show="!noticeShow" :style="{'top':'50px'}">
      <agGridComponents
        ref="agGridComponent"
        :getGridOptions="gridOptions"
        :getColumnDefs="columnDefs"
      ></agGridComponents>
    </div>
    <div class="m-page" v-if="!noticeShow">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        @prev-click="handlePrevClick"
        @next-click="handleNextClick"
        :current-page="currentPage"
        :page-sizes="[30,50,100,150,200]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
    <!-- 查看公告详情 -->
    <noticeDetailsComponent
      v-if="noticeShow"
      :setClickValue="clickValue"
      @cancelComponents="cancelComponents"
    ></noticeDetailsComponent>
  </div>
</template>

<script>
import _Api from "@/api";
import serviceTime from "@/public/serverTime.js";
import agGridComponents from "@/components/agGridComponents.js"
import Vue from "vue";
import noticeDetailsComponent from "@/views/mine/noticeDetailsComponent.vue"

const operator = Vue.extend({
  template: `<span>
		<el-button type="text" @click="viewDetails" class="rendererClass" size="mini" >查看</el-button>
		</span>`,
  data () {
    return {
      delDetailsShow: operator.delDetailsShow
    };
  },
  methods: {
    viewDetails () {
      this.params.context.componentParent.viewDetails(this.params.node);
    }
  }
});

export default {
  data () {
    return {
      headerRuleForm: {},
      ruleForm: {
        traType: 2,
        priority: 0
      },
      title: "",
      applySDate: "",
      applyEDate: "",
      po1: {
        disabledDate: this.disabledDate1
      },
      po2: {
        disabledDate: this.disabledDate2
      },
      state: 0,
      stateOptions: [
        { value: 0, label: "全部" },
        { value: 1, label: "未发布" },
        { value: 2, label: "已发布" }
      ],
      current: 0,
      textChange: 0,
      currentPage: 1,
      pageSize: 30,
      total: 0,
      gridOptions: {},
      columnDefs: [],
      btnDis: false,
      operation: "",//操作
      btnIf: true,
      clickState: "",
      directory: 'd:',
      noticeShow: false,
      clickValue: {},
      // 日期控件默认值   
      placeholder:{
          start:'',
          end:''
      }
    }
  },
  methods: {
    // 设置日期范围
    disabledDate1 (time) {
      if (this.applyEDate)
        return time.getTime() > new Date(this.applyEDate).getTime();
    },
    disabledDate2 (time) {
      if (this.applySDate)
        return time.getTime() < (new Date(this.applySDate).getTime() - 3600 * 1000 * 24);
    },
    // 查询公告列表
    search (flag) {
      this.$refs.agGridComponent.loading = true;
      this.btnDis = true;
      var that = this;
      var obj = {};
      obj.geParams = {};
      obj.leParams = {};
      obj.eqParams = {};
      obj.likeParams = {};
      obj.size = this.pageSize;
      if (flag === 1)
        this.currentPage = 1;
      obj.current = this.currentPage;
      obj.eqParams.state = 1;
      if (this.title)
        obj.likeParams.title = this.title;
      if (this.applySDate)
        obj.geParams.releaseDate = this.applySDate + " 00:00:00";
      if (this.applyEDate)
        obj.leParams.releaseDate = this.applyEDate + " 23:59:59";
      this.$refs.agGridComponent.rowDataChange = false;
      _Api.getNoticeInfo(obj).then(function (response) {
        that.$refs.agGridComponent.loading = false;
        that.current = 0;
        that.textChange = 0;
        that.btnDis = false;
        var data = response.data;
        if (data.code == "1") {
          if (data.total > 0) {
            that.$refs.agGridComponent.gridOptions.api.setRowData(data.rows.splice(0));
            that.$refs.agGridComponent.rowDataChange = true;
            that.total = data.total;
            // that.currentPage = that.current;
          } else {
            that.$refs.agGridComponent.gridOptions.api.setRowData([]);
            that.total = 0;
            that.currentPage = 1;
          }
        } else {
          that.$alert(data.info, {
            showClose: false,
            confirmButton: "确定",
            customClass: "alertFailure"
          });
          that.$refs.agGridComponent.gridOptions.api.setRowData([]);
          that.total = 0;
          that.currentPage = 1;
        }
      }).catch((err) => {
        that.current = 0;
        that.textChange = 0;
        that.$alert(err.data.message, {
          showClose: false,
          confirmButton: "确定",
          customClass: "alertFailure"
        });
      })
    },
    // 查看公告详情
    viewDetails (pramas) {
      if (!pramas) {
        var row = this.$refs.agGridComponent.gridOptions.api.getSelectedRows();
        if (row.length <= 0) {
          this.$alert("提示：请选择需要查看的数据！", {
            showClose: false,
            confirmButtonText: "确定",
            customClass: "alertPrompt"
          });
          return;
        }
        if (row.length > 1) {
          this.$alert("提示：只能选择单行进行编辑！", {
            showClose: false,
            confirmButtonText: "确定",
            customClass: "alertPrompt"
          });
          return;
        }
        this.clickValue = row[0]
        this.noticeShow = true
      } else {
        this.clickValue = pramas.data
        this.noticeShow = true
      }

      // console.log(row)
    },
    // 关闭详情页回调
    cancelComponents (msg) {
      if (msg) {
        this.noticeShow = false;
        this.search();
      }
    },
    handleSizeChange (params) {
      this.currentPage = 1;
      this.pageSize = params;
      this.search();
    },
    handleCurrentChange (params) {
      if (this.textChange === 1 || this.current === 1)
        this.currentPage = 1;
      else
        this.currentPage = params;
      this.search();
    },
    handlePrevClick (params) {
      if (this.textChange === 1 || this.current === 1)
        this.currentPage = 1;
      else
        this.currentPage = params;
      // this.search();
    },
    handleNextClick (params) {
      if (this.textChange === 1 || this.current === 1)
        this.currentPage = 1;
      else
        this.currentPage = params;
      // this.search();
    },
    handleClose (done) {
      this.attachmentList = [];
      this.files = [];
      done();
      this.search();
      this.btnIf = true;
    }
  },
  mounted () {
    var that = this;
    // this.userInfo.userType = this.$global.user.userTypeId;
    serviceTime.getServiceTime().then((serviceTime) => {
      that.applyEDate = serviceTime.Format("yyyy-MM-dd");
      that.applySDate = new Date(serviceTime.getTime() - 604800000).Format('yyyy-MM-dd');
      that.placeholder.start = "开始日期"
      that.placeholder.end = "结束日期"
    })
  },
  components: {
    agGridComponents,
    noticeDetailsComponent
  },
  beforeMount () {
    this.gridOptions = {
      context: {
        componentParent: this
      },
      //	            enableColResize: true,
      //	            localeText: localeText,
      //          	defaultColDef:{
      //      	    	menuTabs:[]
      //      	    },
      //          	getContextMenuItems:[],
      // onCellValueChanged: this.cellValueChanged,
      singleClickEdit: true
    };
    this.columnDefs = [
      { headerName: "标题", field: "title" },
      { headerName: "发布人", field: "releaser" },
      {        headerName: "发布日期", field: "releaseDate", cellRenderer: function (params) {
          if (params.value)
            return new Date(Date.parse(params.value.replace(/-/g,"/"))).Format("yyyy-MM-dd");
        }
      },
      {        headerName: "类型", field: "type", cellRenderer: function (params) {
          if (params.value === 0)
            return '<span class="ag-icon">通知公告</span>'
        }
      },
      {
        headerName: "操作",
        field: "operator",
        cellRendererFramework: operator,
        width: 50
      },
    ]
  },
  watch: {
    title (params) {
      //标题
      if (params)
        this.textChange = 1;
      else
        this.textChange = 0;
    },
    applySDate (params) {
      this.current = 1;
    },
    applyEDate (params) {
      this.current = 1;
    },
    state () {
      this.current = 1;
    }
  }
}
</script>

<style>
</style>